<!--
 * @Author: your name
 * @Date: 2021-06-18 17:26:43
 * @LastEditTime: 2021-06-19 23:28:26
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \学成在线\index.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学成在线</title>
    <link rel="stylesheet" href="./index.css">
</head>
<body>
    <!-- 窗口广告区域 -->
    <ul class="advertising">
        <li>编程入门</li>
        <li>前端分析师</li>
        <li>机器学习工程师</li>
        <li>前端开发工程师</li>
        <li>人工智能工程师</li>
        <li>全栈工程师</li>
        <li>IOS工程师</li>
        <li>VR开发者</li>
        <li>深度学习</li>
        <li>Android开发工程师</li>
        
    </ul>
    
    <!-- 头部区域 -->
    <header class="header">
        <div class="logo"></div>
        <div class="zhonjian">
            <ul>
                <li>首页</li>
                <li>课程</li>
                <li>职业规划</li>
            </ul>
            <div class="search">
                <input class="text6" type="text" placeholder="请输入你要搜索的内容">
                <input class="btn" type="button">
            </div>
        </div>
        <div class="user">
            <span class="userimg"><img src="./imgs/header/Snipaste_2021-06-15_19-38-10.png" alt="头像"></span>
            <span>用户账号</span>
        </div>
    </header>
    <!-- banner广告区域 -->
    <div class="banner">
       
        <div class="ban_text">
            
            <div class="ban_left">
                <ul>
                    <li><span class="span_left">前端开发</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">后端开发</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">移动开发</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">人工智能</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">职业预测</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">云计算</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">大数据</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">运维与测试</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">UI设计</span> <span class="span_right">&gt;</span></li>
                    <li><span class="span_left">产品</span> <span class="span_right">&gt;</span></li>
                   
                </ul>
            </div>           
            
            <div class="ban_right">
                <span class="biaoti">我&nbsp;的&nbsp;课 程 表</span>
                <ul>
                    <li>
                        <span class="span_top">继续学习程序语言设计</span>
                        <span class="span_bottom">正在学习-使用对象</span>
                    </li>
                    <li>
                        <span class="span_top">继续学习程序语言设计</span>
                        <span class="span_bottom">正在学习-使用对象</span>
                    </li>
                    <li>
                        <span class="span_top">继续学习程序语言设计</span>
                        <span class="span_bottom">正在学习-使用对象</span>
                    </li>
                </ul>
                <div><input class="btn_kc" type="button" value="全 部 课 程"></div>
            </div>
        </div>
    </div>

    <!-- content 内容区域 -->
    <div class="content">
        <!-- 导航区域 -->
        <div class="con_header">
            <ul>
                <li class="con_header_first"><a href="#">精品推荐</a></li>
                <li><a href="#">精品推荐</a></li>
                <li><a href="#">精品推荐</a></li>
                <li><a href="#">精品推荐</a></li>
                <li><a href="#">精品推荐</a></li>
                <li><a href="#">精品推荐</a></li>
                <li><a href="#">精品推荐</a></li>
                <li class="con_header_last"><a href="#">修改兴趣</a></li>
               
            </ul>
        </div>
        <!-- 各个模块区域 -->
        <!-- 精品推荐模块 -->
        <div class="con_top">
            <span class="con_top_first">精品推荐</span>
            <span class="con_top_last">查看全部</span>
        </div>
        <div class="con_all">
            <ul class="clearfix">
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    <div class="new"><img src="./imgs/connect/new 拷贝.png" alt=""></div>
                    <div class="text">Think PHP 5.0博客系统实战项目演练 </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                
                
                
            </ul>
        </div>

       
<!-- 编程入门模块 -->
     <div class="box_rml_header">
        <span class="con_top_first">编程入门</span>
        <div>
            <ul>
                <li>热门</li>
                <li>热门</li>
                <li>热门</li>
                <li>热门</li>
            </ul>
        </div>
        <span class="con_top_last">查看全部</span>
    </div>
    <div class="box_rm1">
        
        <div class="box_rm1_left">
            <img src="./imgs/编程入门模块/left.png" alt="">
        </div>
        <div class="box_rm1_right">
            <div class="box_rm1_right_top"><img src="./imgs/编程入门模块/图层 155.png" alt=""></div>
            <ul>
                <li>
                    
                    <div class="text">Android Hybrid APP开发实战H5+原生!
                    </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    
                    <div class="text">Android Hybrid APP开发实战H5+原生!
                    </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    
                    <div class="text">Android Hybrid APP开发实战H5+原生!
                    </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
                <li>
                    
                    <div class="text">Android Hybrid APP开发实战H5+原生!
                    </div>
                    <div class="text3">
                        <span class="orenge">高级 </span>
                        <div class="point"></div>
                        <span class="pinlun"> 1125人在学习</span>
                    </div>
                </li>
            </ul>
        </div>
    </div>
        
    </div>
    
     

    <!-- footer底部区域 -->
    <div class="footer">
        <div class="footer_text">
            <div class="footer_text_left">
                <div class="footer_text_left_img"><img src="./imgs/header/logo.png" alt=""></div>
                <div class="div">学成在线致力于著及中国最好的教育它与中国一流大学和机构合作提供在线课程。 2017年XTCG Inc.保留所有权利。一沪1Cr备15025210号
                </div>
                <div><input class="btn" type="input" value="下载APP"></div>
            </div>
            <div class="footer_text_right">
                <ul>
                    <li class="li1">
                        <ul>
                            <li class="li_first">关于学成网</li>
                            <li>关于</li>
                            <li>管理团队</li>
                            <li>工作机会</li>
                            <li>客户服务</li>
                            <li>帮助</li>
                        </ul>
                    </li>
                    <li class="li1">
                        <ul>
                            <li class="li_first">新手指南</li>
                            <li>如何注册</li>
                            <li>如何选课</li>
                            <li>如何拿到毕业证</li>
                            <li>学分是什么</li>
                            <li>考试未通过怎么办</li>
                        </ul>
                    </li>
                    <li class="li1">
                        <ul>
                            <li class="li_first">合作伙伴</li>
                            <li>合作机构</li>
                            <li>合作导航</li>
                            
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</body>
</html>